<!doctype html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<title>归档</title>
		<meta name="description" content="" />
		<meta name="keywords" content="" />
		<link rel="stylesheet" type="text/css" href="statics/css/index.css" th:href="@{/statics/css/index.css}" media="all" />
	</head>

	<body class="home blog custom-background round-avatars">
	<div th:replace="~{common/repitation::sider}"></div>
	<div th:replace="~{common/repitation::header}"></div>
		<div id="main" class="content">
			<div class="container">
				<section class="post_content" itemscope itemtype="http://schema.org/Article">
					<header class="post_header">
						<h1 class="post_title">归档</h1>
					</header>
					<div class="post-Archive">
						<div id="archives">
							<div class='archive-title' th:each="art:${arts}" >
								<h3 th:text="${#dates.format(art.editorDate,'yyyy-MM')}">2018-3</h3>
								<div class='archives archives-3' data-date='2018-3'>
									<div class="brick">
										<a th:href="@{/detail/}+${art.id}"><span class="time" th:text="${#dates.format(art.editorDate,'MM-dd')}">3-20</span>[[${art.editorTitle}]]<span>(31)</span></a>
									</div>
								</div>
							</div>
							<!--					分页显示-->
							<div class="pagination js-pagination">
								<div class="js-next pagination__load">
									<script type="text/javascript" th:src="@{/jquery.min.js}"></script>
									<style>
										a{cursor:pointer;}
										a:hover{color:green;}
										a.active{color:red;}
									</style>
									<a name="pageNum" class="allpage"><b th:text="'共 '+ ${pages.getTotalPages()}+ ' 页'"></b></a>
									<a  th:if="${pages.hasPrevious()} == true" th:href="@{/archives(currentPage=${pages.previousPageable().getPageNumber()})}"  >上一页</a>
									<a name="pageNum" th:href="@{/archives(currentPage=${i})}"  th:each="i :${#numbers.sequence(0, pages.getTotalPages()-1)}" th:text="${i+1}" th:class="${pages.getNumber()==i}?'active'" th:if="${i}<3" ></a>
									<a th:text="..."  th:if="${pages.getTotalPages()}>2"></a>
									<a th:text="${pages.getNumber()+1}" th:class="active" th:if="${pages.getNumber()}>2"></a>


									&nbsp;&nbsp;<a name="pageNum" th:if="${pages.hasNext()} == true"  th:href="@{/archives(currentPage=${pages.nextPageable().getPageNumber()})}" >下一页</a>
									&nbsp;&nbsp;<a th:href="@{'/archives?currentPage='+ ${pages.getTotalPages()-1}}" >尾页</a>
									<script>
										$("a").click(function(){
											$(this).addClass("active").siblings().removeClass("active");
										})
									</script>
								</div>
							</div>


							<div class="pagination js-pagination">
								<div class="js-next pagination__load">
									<a ><i class="iconfont">&#xe605;</i></a>
								</div>
							</div>

						</div>
					</div>
				</section>
				</div>
			</div>

	<div th:replace="~{common/repitation::footer}"></div>	</body>

</html>